<template>
  <div class="menuDiv">
    <div class="menuHeader">
      <img src="/favicon.ico">
      <h1>蓝天智慧物业</h1>
    </div>
    
    <el-menu class="el-menu-vertical-demo el-left-menu" background-color="#001529" text-color="#fff" :router="true" active-text-color="#ffd04b">
      <el-menu-item index="/index">
        <i class="el-icon-menu"></i>
        <span slot="title">首页</span>
      </el-menu-item>

      <el-submenu index="2">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>收费管理</span>
        </template>
        
        <el-menu-item-group>
          <el-menu-item index="/controller">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>综合收银台</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/desposit">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>押金管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/temporary">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>临时收费</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/premoney">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>预存款管理</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="/AssetsManagement">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>资产管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/BusinessDistrictManagement">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>商业区管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/BuildingManagement">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>楼栋管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/shops">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>商铺管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/RentControlChart">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>租控图</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="3">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>收费设置</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="/ChargeItemManagement">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费项管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/LeaseSaleContractManagement">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>租售合同管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/ChargeDataGeneration">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费数据生成</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/MeterReadingDataGeneration">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>抄表数据管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/ChargeOrderData">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费订单数据</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/ChargeCall">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>费用催缴</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/ExpenseIncurred">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>待生成的费用</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="5">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>协同办公</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="5-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>我发起的流程</span>
            </template>
          </el-menu-item>
          <el-menu-item index="5-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>报修工单</span>
            </template>
          </el-menu-item>
          <el-menu-item index="5-3">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>投诉工单</span>
            </template>
          </el-menu-item>
          <el-submenu index="5-4">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>待办事项</span>
            </template>
            <el-menu-item index="5-4-1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>我的待办</span>
              </template>
            </el-menu-item>
            <el-menu-item index="5-4-2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>我的已办</span>
              </template>
            </el-menu-item>
          </el-submenu>

          <el-submenu index="5-5">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>工作流管理</span>
            </template>
            <el-menu-item index="5-5-1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>流程设计器</span>
              </template>
            </el-menu-item>
            <el-menu-item index="5-5-2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>模型部署</span>
              </template>
            </el-menu-item>
          </el-submenu>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="6">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>业主管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="6-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>小程序用户</span>
            </template>
          </el-menu-item>
          <el-menu-item index="6-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>业主通知公告</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/OwnerMassage">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>业主信息</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="7">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>无感停车收费</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="7-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>停车场管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>停车场计费规则</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-3">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>道闸管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-4">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>道闸设备</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-5">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>场内车辆</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-6">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>车辆通行记录</span>
            </template>
          </el-menu-item>
          <el-menu-item index="7-7">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费记录</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="8">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>统计报表</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="8-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费日报表</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费项汇总表</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-3">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费明细表</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-4">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>预收款余额</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-5">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费统计</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-6">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>欠费数据</span>
            </template>
          </el-menu-item>
          <el-menu-item index="8-7">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>收费统计（商铺）</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="9">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>团队管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="9-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>员工管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="9-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>部门管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="9-3">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>岗位管理</span>
            </template>
          </el-menu-item>
        </el-menu-item-group>
      </el-submenu>

      <el-submenu index="10">
        <template slot="title">
          <i class="el-icon-location"></i>
          <span>系统管理</span>
        </template>
        <el-menu-item-group>
          <el-menu-item index="10-1">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>消息推送管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-2">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>支付方式</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-3">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>角色管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-4">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>菜单管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-5">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>字典管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-6">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>参数设置</span>
            </template>
          </el-menu-item>
          <el-menu-item index="10-7">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>通知公告</span>
            </template>
          </el-menu-item>
          <el-submenu index="10-8">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>日志管理</span>
            </template>
            <el-menu-item index="10-8-1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>操作日志</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-8-2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>登录日志</span>
              </template>
            </el-menu-item>
          </el-submenu>
          <el-submenu index="10-9">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>系统监控</span>
            </template>
            <el-menu-item index="10-9-1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>在线用户</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-9-2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>定时任务</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-9-3">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>数据监控</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-9-4">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>服务监控</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-9-3">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>缓存监控</span>
              </template>
            </el-menu-item>
          </el-submenu>
          <el-submenu index="10-10">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>系统工具</span>
            </template>
            <el-menu-item index="10-10-1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>表单构建</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-10-2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>代码生成</span>
              </template>
            </el-menu-item>
            <el-menu-item index="10-10-3">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>系统接口</span>
              </template>
            </el-menu-item>
          </el-submenu>
        </el-menu-item-group>
      </el-submenu>
    </el-menu>
  </div>

</template>

<script>
export default {
  name: "LeftMenu",
};
</script>

<style>
.menuHeader {
  width: 100%;
  height: 60px;
  background-color: #031e39;
  display: flex;
  align-items: center;
  justify-content: center;
}

img {
  margin-right: 10px;
  width: 35px;
  height: 35px;
}

h1 {
  color: white;
}

.menuDiv {
  height: 100%;
  overflow: hidden;
}

.el-left-menu {
  height: 100%;
  border-right-color: #001529 !important; /*!important当前样式优先级最高*/
  overflow: auto;
}
.el-left-menu::-webkit-scrollbar {
  background-color: #001529;
  width: 0%;
}
</style>